<!doctype html>
<html class="no-js">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport"content="width=device-width, initial-scale=1">
    <title>产品列表综合页面</title>

    <!-- Set render engine for 360 browser -->
    <meta name="renderer" content="webkit">
    <link rel="stylesheet" href="/public/plugins/dropload/dropload.css">
    <link rel="stylesheet" href="/public/home/mobile/css/amazeui.min.css">
    <link rel="stylesheet" href="//at.alicdn.com/t/font_375026_rvwbccd6qqqto6r.css">

    <style type="text/css">
        /* 两列右侧自适应布局 */
        .am-titlebar-cols .am-titlebar-nav a{text-align: center; margin-right:40px; }
        .am-titlebar-cols .am-titlebar-nav a{
            text-align: center;
            margin-right: 56px;
        }
        .am-titlebar-cols{
            padding-left: 26px;
            border-top: none;
            margin-top: 0px;
        }
        p{
            margin: 0px;
            padding: 0px;
        }
         #sist .neirr {height: 44vw;background-size: cover;background-repeat: no-repeat;;background-position: center center; }
         .am-thumbnail{margin-bottom: 0;border-bottom: 0;padding: 5px;}
         .am-thumbnail-caption{margin-top:0px!important;border: 1px solid #ccc; border-top:0;  }
    </style>
</head>
<body>
<div class="am-g" style=" overflow: hidden;
           white-space: nowrap;
          text-overflow: ellipsis;height: 32px;line-height: 32px;margin: 5px 0px;">
    <div class="am-u-sm-10" onclick="history.back(-1)">
        <span class="icon iconfont icon-xiangzuojiantou"></span>
    </div>
    <div class="am-u-sm-2">
        <!--<a href="{:url('/home/Cart')}"><span class="icon iconfont icon-gouwuche"></span></a>-->
        <div style="float:right;"><span class="icon iconfont icon-sousuo"  onclick="location.href='{:url('/home/Goods/search')}?goods_name='+$('#keys').val()"></span></div>
    </div>
</div>
<div data-am-widget="titlebar" class="am-titlebar am-titlebar-cols" >
    <nav class="am-titlebar-nav">
        <div class="am-g" style="margin: 0px;padding: 0px;">
            <div class="am-u-sm-3">
                <a  onclick="setOrder('goods_sort')" class="">综合<span id="sale_number" class="icon iconfont icon-xiala"></span></a>
            </div>
            <div class="am-u-sm-3">
                <a onclick="setOrder('sale_number')"  class="">销量<span id="sale_number" class="icon iconfont icon-xiala"></span></a>
            </div>

            <div class="am-u-sm-3">
                <a onclick="setOrder('create_time')"  class="">新品<span id="sale_number" class="icon iconfont icon-xiala"></span></a>
            </div>
            <div class="am-u-sm-3">
                <a onclick="setOrder('market_price')"  class="">价格<span id="icon" class="icon iconfont icon-xiala"></span></a>
            </div>
        </div>
    </nav>
</div>
<div class="am-g" style="text-align: center; padding-right:10px;" id="list">

</div>

<!--[if lt IE 9]>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
<script src="/public/home/mobile/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->

<!--[if (gte IE 9)|!(IE)]><!-->
<script src="/public/plugins/jquery.min.js"></script>
<!--<![endif]-->
<script src="/public/home/mobile/js/amazeui.min.js"></script>
<script src="/public/plugins/template/template.js"></script>
<script src="/public/plugins/dropload/dropload.min.js"></script>
<script type="text/html" id="list-tpl">
    {{ each data as val index}}
    <div class="am-u-sm-6" style="padding: 0;padding-left: 10px;" id="sist">
        <a href="{{ val.url}}" style="color: #424242;">
        <div class="am-thumbnail" >
            <div class="neirr" style="background-image:url('{{ val.goods_thumb}}')"/></div>
            <div class="am-thumbnail-caption" style="margin: 10px 0;">
                <p style="overflow: hidden;white-space: nowrap;text-overflow: ellipsis;">{{ val.fulltitle}}</p>
                <p style="overflow: hidden;
           white-space: nowrap;
          text-overflow: ellipsis;">￥&nbsp{{ val.simple_price}}延米</p>
                <!--<a href="{{ val.url}}" style="color: #fff;background: #40BDFF;border: none;outline: none; padding: 5px;">立即预约</a>-->
            </div>
        </div>
        </a>
    </div>
    {{ /each}}
</script>
<script>
    var datas = {
        page: 0,
        p1: 'goods_sort',
        p2: 'asc'
    };
    var drop = $('#page').dropload({
        scrollArea: window,
        loadDownFn: function (me) {
            datas.page++;
            $.ajax({
                url: "{:url('/home/Goods/allList')}",
                data: {cid: "{$Request.param.cid}", p1: datas.p1, p2: datas.p2},
                success: function (data) {
                    if (datas.page >= data.last_page) {
                        me.noData();
                        me.lock();
                    }
                    var html = template('list-tpl', data);
                    $('#list').append(html);
                    me.resetload();
                }
            });
        }
    });

    function setOrder(order) {
            if (order === 'goods_sort') {
                datas.p1 = order;
                datas.p2 = 'asc'
            }
            if (order === 'sale_number') {
                datas.p1 = order;
                datas.p2 = 'desc'
            }
            if (order === 'market_price') {
                datas.p1 = order;
                if (datas.p1 === 'market_price') {
                    datas.p2 = datas.p2 === 'desc' ? 'asc' : 'desc';
                } else {
                    datas.p2 = 'asc'
                }
            }
            $('#list').empty();
            drop.noData(false);
            drop.unlock();
            drop.resetload();
        }
</script>
</body>
</html>
